<template>
  <div class="home-container">
    <pro-form
      :fields="fields"
      @submit="onSubmit"
    />
  </div>
</template>

<script>
import proForm from '@/components/pro-form'
export default {
  name: 'FormIndex',
  components: {
    proForm
  },
  props: {},
  data () {
    return {
      // inline: true, // 行内表单模式
      fields: [
        {
          title: '用户名',
          key: 'username',
          isRequired: true,
          contentWidth: 220,
          defaultValue: '李明',
          props: {
            placeholder: '请输入用户名'
          }
        },
        {
          title: '密码',
          key: 'password',
          isRequired: true,
          dataType: 'int',
          // dataType: 'float',
          defaultValue: '1234',
          props: {
            placeholder: '请输入密码',
            showPassword: true
          }
        },
        {
          title: '年龄',
          key: 'age',
          type: 'inputNumber',
          defaultValue: 18
        },
        {
          title: '性别',
          key: 'sex',
          type: 'select',
          options: [
            {
              label: '男',
              value: 1
            },
            {
              label: '女',
              value: 2
            }
          ],
          defaultValue: 1
        }
      ]
    }
  },
  computed: {},
  watch: {},
  created () {},
  mounted () {},
  methods: {
    onSubmit (form) {
      console.log('form', form)
    }
  }
}
</script>

<style scoped lang="scss">
</style>
